<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>找酒店主页</title>
    <meta name="viewport"
          content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, width=device-width">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-touch-fullscreen" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <meta name="format-detection" content="address=no">
    <link rel="stylesheet" type="text/css" href="/hodelcss/common.css">
    <link rel="stylesheet" type="text/css" href="/hodelcss/index.css">
    <link rel="stylesheet" type="text/css" href="/hodelcss/mui.min.css"/>
    <link rel="stylesheet" href="/hodelcss/reset.css">

    <script src="/js/jquery/jquery.min.js"></script>
    <script type="text/javascript" src="/hodeljs/iscroll.js"></script>
    <script type="text/javascript" src="/hodeljs/jquery.flexslider-min.js"></script>
    <script src="/hodeljs/hmt.js" type="text/javascript"></script>
    <script type="text/javascript" src="/hodeljs/index.js"></script>
    <script src="/hodeljs/swiper.min.js" type="text/javascript"></script>

    <script src="/js/bootstrap/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="/css/font/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="/css/reset.css"/>
    <link rel="stylesheet" href="/css/myStrategyComment.css"/>
    <script src="/js/plugins/jrender/jrender.min.js"></script>
    <link rel="stylesheet" href="/js/plugins/dialog2/dialog.css"/>
    <script src="/js/plugins/dialog2/dialog.min.js"></script>
    <script src="/js/jquery/jquery.form.js"></script>
    <script src="/js/common.js"></script>


</head>

<body>
<header class="hasManyCity" id="header">
    <div class="col-3" style="width:100%">
        <a href="index.html">
            <span><i class="fa fa-chevron-left fa-2x" style="color: white"></i></span>
        </a>
    </div>
    <div id="locaitonBtn" class="link-url locaitonBtn"></div>
</header>
<div id="container">
    <div id="main">
        <div id="scroller">
            <section class="banner">
                <div class="swiper-container swiper-container1" id="push11">
                    <div class="swiper-wrapper bannerwidth">
                        <div class="swiper-slide swiper-slide-duplicate">
                            <a href="#">
                                <img src="img/travelTicket/8.jpg">
                            </a>
                        </div>
                        <div class="swiper-slide">
                            <a href="#">
                                <img src="img/travelTicket/12.jpg">
                            </a>
                        </div>
                        <div class="swiper-slide swiper-slide-duplicate">

                                <img src="https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=2866473930,3842249109&fm=26&gp=0.jpg">

                        </div>
                    </div>
                    <div class="swiper-pagination swiper-pagination1">
                    </div>
                </div>
            </section>

            <section class="slider">
                <div class="swiper-container swiper-container2">
                    <div class="swiper-wrapper tuangouwidth">
                        <div class="swiper-slide swiper-slide-duplicate">
                            <ul class="icon-list">
                                <li class="icon">
                                    <a href="/hoteldetail.html?hotelType=1">
												<span class="icon-circle">
													<img src="img/qinglv.jpg">
												</span>
                                        <span class="icon-desc">情侣酒店</span>
                                    </a>
                                </li>
                                <li class="icon">
                                    <a href="/hoteldetail.html?hotelType=2">
												<span class="icon-circle">
													<img src="img/travelTicket/lianjia.jpg">
												</span>
                                        <span class="icon-desc">特价酒店</span>
                                    </a>
                                </li>
                                <li class="icon">
                                    <a href="/hoteldetail.html?hotelType=3">
												<span class="icon-circle">
													<img src="img/shangwu.jpg">
												</span>
                                        <span class="icon-desc">快捷商务酒店</span>
                                    </a>
                                </li>
                                <li class="icon">
                                    <a href="/hoteldetail.html?hotelType=4">
												<span class="icon-circle">
													<img src="img/travelTicket/15.jpg">
												</span>
                                        <span class="icon-desc">高档星级酒店</span>
                                    </a>
                                </li>
                                <li class="icon">
                                    <a href="#">
												<span class="icon-circle">
													<img src="img/travelTicket/jifen.jpg">
												</span>
                                        <span class="icon-desc">积分兑换</span>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <div class="swiper-pagination swiper-pagination2">
                    </div>
                </div>
            </section>
        </div>
        <div id="index" class="page-center-box">
            <div>
                <!--首页限时抢购开始-->
                <div class="sy_title"><span class="left">限时抢购</span>
                    <div class="sy_limit_buy_time left">
                        <em class="ico"></em>
                        距离结束
                        <div id="countdown"></div>

                    </div>
                </div>
                <div class="sy_limit_buy mb10">
                    <div class="locatLabel_switch swiper-container5 swiper-container-horizontal swiper-container-free-mode swiper-container-android"
                         id="purchase">
                        <div class="swiper-wrapper" render-loop="list">
                            <div class="box swiper-slide">
                                <a render-fun="sethref" render-key="list.id" data-href="/hotelComment.html?id=">
                                    <img render-src="list.coverUrl" width="" height="">
                                    <p class="txt_center overflow_clear" render-html="list.name"></p>
                                    <p class="txt_center fontcl1" render-html="list.price"></p>
                                    <p>人民币</p>

                                </a>
                            </div>
                        </div>
                    </div>

                </div>
                <!--首页限时抢购结束-->


                <!--广告轮播-->
                <div class="banner">
                    <div class="flexslider guanggao">
                        <ul class="slides">
                            <li>
                                <a href="/ticket.html" title="开始旅行吧!">
                                    <img src="img/travelTicket/jdian.jpg" alt="景点推荐" width="120%">
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
                <!--广告轮播end-->

                <!--专享推荐-->
                <div class="sy_title mb10">
                    <span class="left">热门推荐</span>
                    <a href="/hoteldetail.html" class="fr morethree">查找全部酒店&gt;&gt;</a>
                </div>
                <div class="sy_recmd">
                    <div class="sy_recmd_list_box" id="push">
                        <ul render-loop="list">
                            <li class="sy_recmd_list">
                                <div class="box">
                                    <div class="pub_img">
                                        <a render-fun="sethref" render-key="list.id"
                                           data-href="/hotelComment.html?id="><img render-src="list.coverUrl"
                                                                                   width="145" height="145"></a>
                                    </div>
                                    <div class="pub_wz">
                                        <div class="nr_box">

                                            <span class="fl black9">[酒店]</span>
                                            <p class="fr price fontcl2" render-html="list.name"></p>
                                        </div>
                                        <div class="nr_box">
                                            <span class="fl black9">[优惠房价]</span>
                                            <p class="fr price fontcl2" render-html="list.price"></p>
                                        </div>
                                        <div class="nr_box">
                                            <span class="fl black9">[地址]</span>
                                            <p class="fr price fontcl2" render-html="list.address"></p>
                                        </div>
                                    </div>
                                </div>
                            </li>
                        </ul>
                        <div class="clear"></div>
                    </div>
                </div>
                <!--专享推荐end-->
            </div>
        </div>
    </div>
</div>

<script>
    $(function () {

        console.log("执行方法");
        //限时抢购的回显
        $.get("/hotel", {pageSize: 3, state: 1, orderBy: "sequence"}, function (data) {
            $("#purchase").renderValues(data, {
                sethref: function (item, value) {
                    var data = $(item).data("href");
                    $(item).attr("href", data + value);
                }
            })
        })

        //热门的回显
        $.get("/hotel", {pageSize: 2, state: 3, orderBy: "sequence"}, function (data) {
            console.log(data);
            $("#push").renderValues(data, {
                sethref: function (item, value) {
                    var data = $(item).data("href");
                    $(item).attr("href", data + value);
                }
            })
        })


        //时间倒计时
        function ShowCountDown(year, month, day, divname) {
            var now = new Date();
            var endDate = new Date(year, month, day);
            var leftTime = endDate.getTime() - now.getTime();
            var dd = parseInt(leftTime / 1000 / 60 / 60 / 24, 10) - 30;//计算剩余的天数
            var hh = parseInt(leftTime / 1000 / 60 / 60 % 24, 10);//计算剩余的小时数
            var mm = parseInt(leftTime / 1000 / 60 % 60, 10);//计算剩余的分钟数
            var ss = parseInt(leftTime / 1000 % 60, 10);//计算剩余的秒数
            dd = checkTime(dd);
            hh = checkTime(hh);
            mm = checkTime(mm);
            ss = checkTime(ss);//小于10的话加0
            var cc = document.getElementById(divname);
            cc.innerHTML = "还有：" + dd + "天" + hh + "小时" + mm + "分" + ss + "秒";
        }

        function checkTime(i) {
            if (i < 10) {
                i = "0" + i;
            }
            return i;
        }

        window.setInterval(function () {
            ShowCountDown(2019, 3, 15, 'countdown');
        }, 1000);

    })
</script>

<!--<script src="/hodeljs/other.js" type="text/javascript" charset="utf-8"></script>-->
</body>
</html>